<%--
  Created by IntelliJ IDEA.
  User: SYHT
  Date: 2017/5/19
  Time: 15:53
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ page isELIgnored="false" %>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <jsp:include page="documentForeEnd.jsp"/>
    <link href="${pageContext.request.contextPath}/dist/foreEnd/css/bootstrap.css" rel="stylesheet"/>


</head>
<body>
<header>
    <jsp:include page="headerForeEnd2.jsp"/>
</header>


<!--模板管理-->
<div class="container">

    <div class="col-md-8" style="margin-top: 50px">
        <h4 class="apply_h4" style="text-align: center">申请详情</h4>
        <form action="#" method="post">
            <div class="form-group" style="text-align: center">
                <span class="apply_h">模板名称 ：</span>
                <input type="text" class="templet" placeholder="模板名称" autocomplete="off"/></div>
            <hr>
            <div class="templet_icon">
                <a href="#" class="templet_a1" onclick='addElement()'><span class="fa fa-plus"></span></a>&emsp;
                <a href="#" class="templet_a2" onclick='dropElement()'><span class="fa fa-minus"></span></a>
            </div>
            <div id="course" class="col-md-12">
            </div>
            <div class="templet_icon2">
                <a href="#" class="templet_a1" onclick='addElement2()'><span class="fa fa-plus"></span></a>&emsp;
                <a href="#" class="templet_a2" onclick='dropElement2()'><span class="fa fa-minus"></span></a>
            </div>
            <div id="course2" class="col-md-12">
            </div>

            <div style="text-align: center;margin-top: 40px">
                <button class="templet_b">保存</button>
            </div>
        </form>
    </div>

</div>

<script>
    var i = 1;
    function addElement() {
        var div = document.createElement('div');
        div.innerHTML = '<div class="form-group col-md-4" id="course"> ' +
            '<span class="apply_h">原由 ： </span> ' +
            '<input type="text" class="templet2" autocomplete="off"> ' +
            '</div>';
        div.id = 'Elem' + i;
        document.getElementById('course').appendChild(div);
        i++;
    }
    function dropElement() {
        var aaa = document.getElementById('Elem' + (i - 1));
        document.getElementById('course').removeChild(aaa);
        i--;
    }
</script>
<script>
    var j = 1;
    function addElement2() {
        var div2 = document.createElement('div');
        div2.innerHTML = '<div class="form-group col-md-4"> <select style="width:100%;height: 35px;border: 1px solid #cccccc"> <option value=""></option> <option value="">1</option> <option value="">2</option> <option value="">3</option> </select> </div>';
        div2.id = 'Elem2' + j;
        document.getElementById('course2').appendChild(div2);
        j++;
    }
    function dropElement2() {
        var bbb = document.getElementById('Elem2' + (j - 1));
        document.getElementById('course2').removeChild(bbb);
        j--;
    }
</script>
</body>
</html>
